<!DOCTYPE html>
<html lang="en" dir="ltr">

<head prefix="og: http://ogp.me/ns#">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>article – 菠萝头的 7 秒记忆</title>
    


<script>
  
  
    
    var tocFolding = JSON.parse("true");
    
    var tocLevels = JSON.parse("[\"h2\",\"h3\",\"h4\"]");

  
  
      
    var baseurl = JSON.parse("\"https://webjam.cn\"");
    
    var permalink = JSON.parse("\"https://webjam.cn/publication/article/\"");
    
    var langprefix = JSON.parse("\"\"");
    var searchResults = null;
    var searchMenu = null;
    var searchText = null;
    
    
    var enableSearch = JSON.parse("true");
    
    var enableSearchHighlight = JSON.parse("true");
    
    var searchResultPosition = JSON.parse("\"main\"");
    
    var sectionType = JSON.parse("\"publication\"");
    
    var kind = JSON.parse("\"section\"");
    
    var fuse = null;
</script>



















<script src="https://webjam.cn/bundle.scripts.f7f7f3cddcd87e94ba81ec1279f3b1875820df7030e7143e058c130865435e3f.js"></script>    
    


<link rel="stylesheet" href="/css/main.min.css">


    
<link rel="alternate" type="application/rss&#43;xml" title="RSS" href="https://webjam.cn/publication/article/index.xml">

<meta name="description" content="Publication - article" />


<meta name="created" content="2020-03-05T14:08:48&#43;0000">
<meta name="modified" content="2020-03-05T14:08:48&#43;0000">
<meta property="article:published_time" content="2020-03-05T14:08:48&#43;0000">

<meta name="author" content="wencaizhang">


<meta property="og:site_name" content="菠萝头的 7 秒记忆">
<meta property="og:title" content="article">
<meta property="og:url" content="https://webjam.cn/publication/article/">
<meta property="og:type" content="website">
<meta property="og:description" content="Publication - article">

<meta name="generator" content="Hugo 0.72.0" />
<meta name="msapplication-TileColor" content="#fff">

<meta name="theme-color" content="#fff">

<meta name="msapplication-navbutton-color" content="#fff">

<meta name="apple-mobile-web-app-status-bar-style" content="#fff">

<link rel="canonical" href="https://webjam.cn/publication/article/">

<link rel="manifest" href="/manifest.json">

  <link rel="apple-touch-icon" sizes="57x57" href="/favicon/apple-icon-57x57.png">
  <link rel="apple-touch-icon" sizes="60x60" href="/favicon/apple-icon-60x60.png">
  <link rel="apple-touch-icon" sizes="72x72" href="/favicon/apple-icon-72x72.png">
  <link rel="apple-touch-icon" sizes="76x76" href="/favicon/apple-icon-76x76.png">
  <link rel="apple-touch-icon" sizes="114x114" href="/favicon/apple-icon-114x114.png">
  <link rel="apple-touch-icon" sizes="120x120" href="/favicon/apple-icon-120x120.png">
  <link rel="apple-touch-icon" sizes="144x144" href="/favicon/apple-icon-144x144.png">
  <link rel="apple-touch-icon" sizes="152x152" href="/favicon/apple-icon-152x152.png">
  <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-icon-180x180.png">
  <link rel="icon" type="image/png" sizes="192x192" href="/favicon/android-icon-192x192.png">
  <link rel="icon" type="image/png" sizes="192x192" href="/favicon/android-icon-512x512.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="96x96" href="/favicon/favicon-96x96.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png">
  <meta name="msapplication-TileColor" content="#ffffff">
  <meta name="msapplication-TileImage" content="/ms-icon-144x144.png">


    <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "WebPage",
    "url" : "https://webjam.cn/publication/article/",
    "name": "article",
    "description": "Publication - article",
    "mainEntityOfPage": {
      "@type": "WebPage",
      "@id": "https://webjam.cn"
    },
    "publisher": {
      "@type": "Organization",
      "name": "菠萝头的 7 秒记忆",
      "url": "https://webjam.cn"
    }
  }
</script>

    
  
  







    
</head>

<body id="root" class="theme__dark">
    <script>
        var localTheme = localStorage.getItem('theme');
        if (localTheme) {
            document.getElementById('root').className = 'theme__' + localTheme;
        }
    </script>
    <div id="container">
        





        <div class="wrapper" data-type="publication" data-kind="section">
            <nav class="navbar" role="navigation" aria-label="main navigation" data-dir="ltr">
  <div class="navbar__brand">
    
    <a href="/" title="Home" rel="home" class="navbar__logo-link">
      <img src="/logo.png" alt="Home" class="navbar__logo">
    </a>
    
    
      <a href="/" title="Home" rel="home" class="navbar__title-link">
        <h6 class="navbar__title">菠萝头的 7 秒记忆</h6>
      </a>
    
  </div>

  
<div class="theme theme-mobile" data-ani="true">
  <div class="dropdown">
    <button class="dropdown-trigger navbar__slide-down" aria-label="Select Theme Button" style="" data-ani="true">
      <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24"><path fill="none" d="M24 0H0v24h24V0z"/><path fill="currentColor" d="M6.34 7.93c-3.12 3.12-3.12 8.19 0 11.31C7.9 20.8 9.95 21.58 12 21.58s4.1-.78 5.66-2.34c3.12-3.12 3.12-8.19 0-11.31l-4.95-4.95c-.39-.39-1.02-.39-1.41 0L6.34 7.93zM12 19.59c-1.6 0-3.11-.62-4.24-1.76C6.62 16.69 6 15.19 6 13.59s.62-3.11 1.76-4.24L12 5.1v14.49z"/></svg>      
    </button>
    <div class="dropdown-content select-theme">
      
        
        <a href="#" class="dropdown-item select-theme__item is-active">
          dark
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          light
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          hacker
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          solarized
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          kimbie
        </a>
        
      
    </div>
  </div>
</div>


<div id="mobileSearchBtn" class="mobile-search__btn" data-ani="true">
  <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0V0z"/><path d="M15.5 14h-.79l-.28-.27c1.2-1.4 1.82-3.31 1.48-5.34-.47-2.78-2.79-5-5.59-5.34-4.23-.52-7.79 3.04-7.27 7.27.34 2.8 2.56 5.12 5.34 5.59 2.03.34 3.94-.28 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>
</div>

<div id="search-mobile-container" class="mobile-search hide" data-dir="ltr">
  <div class="mobile-search__top">
    <input id="search-mobile" type="text" aria-label="Mobile Search" placeholder="Search" class="mobile-search__top--input"/>
    <div id="search-mobile-close" class="mobile-search__top--icon">
      <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24"><path opacity=".87" fill="none" d="M0 0h24v24H0V0z"/><path fill="currentColor" d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm3.59-13L12 10.59 8.41 7 7 8.41 10.59 12 7 15.59 8.41 17 12 13.41 15.59 17 17 15.59 13.41 12 17 8.41z"/></svg>
    </div>
  </div>
  <div id="search-mobile-results" class="mobile-search__body">
    
  </div>
</div>


<a role="button" class="navbar__burger" aria-label="menu" aria-expanded="false"
  data-ani="true">
  <span aria-hidden="true"></span>
  <span aria-hidden="true"></span>
  <span aria-hidden="true"></span>
</a>
<div class="navbarm__collapse" data-open="false">
  <ul dir="ltr">
    
    
      
      
      
      

      
        <li class="navbarm__menu--item ">
          <a href="/about">About</a>
        </li>
      
      
    
      
      
      
      

      
        <li class="navbarm__menu--item ">
          <a href="/archive">Archive</a>
        </li>
      
      
    
      
      
      
      

      
        <li class="navbarm__menu--item ">
          <a href="/presentation">Pt</a>
        </li>
      
      
    
      
      
      
      

      
        <li class="navbarm__menu--item ">
          <a href="/gallery">
            Gallery
            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path fill="currentColor" d="M8.12 9.29L12 13.17l3.88-3.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-4.59 4.59c-.39.39-1.02.39-1.41 0L6.7 10.7c-.39-.39-.39-1.02 0-1.41.39-.38 1.03-.39 1.42 0z"/></svg>
          </a>
        </li>

        
          <li class="navbarm__menu--item navbarm__menu--subitem">
            <a href="/gallery/cartoon">Cartoon</a>
          </li>
        
          <li class="navbarm__menu--item navbarm__menu--subitem">
            <a href="/gallery/photo">Photo</a>
          </li>
        
          <li class="navbarm__menu--item navbarm__menu--subitem">
            <a href="/gallery/%e5%a4%a7%e8%af%9d%e8%a5%bf%e6%b8%b8/">大话西游</a>
          </li>
        

      
      
    
      
      
      
      

      
        <li class="navbarm__menu--item ">
          <a href="/posts">Posts</a>
        </li>
      
      
    
      
      
      
      

      
        <li class="navbarm__menu--item ">
          <a href="/showcase">Showcase</a>
        </li>
      
      
    
      
      
      
      

      
        <li class="navbarm__menu--item active">
          <a href="/publication">Pub</a>
        </li>
      
      
    

    
      <li class="navbarm__menu--item ">
        <a href="/tags" class="navbarm__menu--term" data-index="0">
          Tags
        </a>
      </li>
    
      <li class="navbarm__menu--item ">
        <a href="/categories" class="navbarm__menu--term" data-index="1">
          Categories
        </a>
      </li>
    
      <li class="navbarm__menu--item ">
        <a href="/series" class="navbarm__menu--term" data-index="2">
          Series
        </a>
      </li>
    
  </ul>
</div>
  <div class="navbar__menu">
  
<div class="theme" data-ani="true">
  <div class="dropdown">
    <button class="dropdown-trigger navbar__slide-down" aria-label="Select Theme Button" data-ani="true">
      <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24"><path fill="none" d="M24 0H0v24h24V0z"/><path fill="currentColor" d="M6.34 7.93c-3.12 3.12-3.12 8.19 0 11.31C7.9 20.8 9.95 21.58 12 21.58s4.1-.78 5.66-2.34c3.12-3.12 3.12-8.19 0-11.31l-4.95-4.95c-.39-.39-1.02-.39-1.41 0L6.34 7.93zM12 19.59c-1.6 0-3.11-.62-4.24-1.76C6.62 16.69 6 15.19 6 13.59s.62-3.11 1.76-4.24L12 5.1v14.49z"/></svg>      
    </button>
    <div class="dropdown-content select-theme">
      
        
        <a href="#" class="dropdown-item select-theme__item is-active">
          dark
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          light
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          hacker
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          solarized
        </a>
        
        <a href="#" class="dropdown-item select-theme__item ">
          kimbie
        </a>
        
      
    </div>
  </div>
</div>

  
  
  
  
  
  
  
  <a href="/about" class="navbar__menu-item navbar__slide-down " dir="ltr" data-ani="true">About</a>
  
  
  
  
  
  
  
  <a href="/archive" class="navbar__menu-item navbar__slide-down " dir="ltr" data-ani="true">Archive</a>
  
  
  
  
  
  
  
  <a href="/presentation" class="navbar__menu-item navbar__slide-down " dir="ltr" data-ani="true">Pt</a>
  
  
  
  
  
  
  
  <div class="navbar__dropdown navbar__slide-down" data-ani="true">
    <a href="/gallery" class="navbar__menu-item "
      dir="ltr">
      Gallery
      <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path fill="currentColor" d="M8.12 9.29L12 13.17l3.88-3.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-4.59 4.59c-.39.39-1.02.39-1.41 0L6.7 10.7c-.39-.39-.39-1.02 0-1.41.39-.38 1.03-.39 1.42 0z"/></svg>
    </a>
    <div class="navbar__dropdown--content">
      
      <a href="/gallery/cartoon" class="navbar__dropdown--item" dir="ltr">Cartoon</a>
      
      <a href="/gallery/photo" class="navbar__dropdown--item" dir="ltr">Photo</a>
      
      <a href="/gallery/%e5%a4%a7%e8%af%9d%e8%a5%bf%e6%b8%b8/" class="navbar__dropdown--item" dir="ltr">大话西游</a>
      
    </div>
  </div>
  
  
  
  
  
  
  
  <a href="/posts" class="navbar__menu-item navbar__slide-down " dir="ltr" data-ani="true">Posts</a>
  
  
  
  
  
  
  
  <a href="/showcase" class="navbar__menu-item navbar__slide-down " dir="ltr" data-ani="true">Showcase</a>
  
  
  
  
  
  
  
  <a href="/publication" class="navbar__menu-item navbar__slide-down active" dir="ltr" data-ani="true">Pub</a>
  
  
</div>
</nav>
            
            
<main class="main pub inner" data-sidebar-position="right">
  
    <section class="pub__section lmr">
      
<nav class="showcase__nav">
  <div class="pub__toolbar--search search">
    <input id="pubSearch" aria-label="Publication Search" class="input" type="text" placeholder="Search" autocomplete="off"/>
  </div>
  <a href="https://webjam.cn/publication/" class="showcase__button ">
    Overview
  </a>
  
    
    
    
    
    <a href="https://webjam.cn/publication/article/" class="showcase__button active" data-meta="1">
      article
    </a>
  
    
    
    
    
    <a href="https://webjam.cn/publication/book/" class="showcase__button " data-meta="1">
      book
    </a>
  
    
    
    
    
    <a href="https://webjam.cn/publication/misc/" class="showcase__button " data-meta="1">
      misc
    </a>
  
</nav>
      <div class="pub__list">
  
  <ul class="pub__ul" data-display="block">
    
    <li class="pub__item">
      <a href="https://webjam.cn/publication/article/article_any_folder_name_1/">
        Good Title
        
        
      </a>
      
        <div class="pub__metas">
          <span class="caption pub__meta">📅 2018-06-01</span><span class="caption pub__meta">✍️ zzossig</span><span class="caption pub__meta">📚 abc</span><span class="caption pub__meta" data-entry-type="article">🎯 article</span>
          
<ul id="tags" class="pub__tags caption">
  
</ul>
        </div>
        <div class="pub__summary">
          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </div>
      
    </li>
    
  </ul>
  <ul class="pub__result" data-display="none">
</ul>
</div>
      <div class="grow"></div>
      


    </section>
  

  
<script defer src="/js/shave.min.11feaa41d2aca6c98288af5174273a58bb59baed9c61a7304b67d3c6fdfef3c5.js"></script>

<script defer src="/js/masonry.pkgd.min.3c7b3ed32991df7fecd94925de903446f7c1257bfeb042cb0b798749e242c559.js"></script>

<script defer src="/js/imagesloaded.pkgd.min.5a65b0ca177f1c0433c0ead611692521c23e6668846a2861fedc09ae11416ffc.js"></script>

<script>
  
  var enableSearchHighlight = JSON.parse("true");
  
  var isFirstSection = JSON.parse("false");
  
  var tagsBaseURL = JSON.parse("\"/tags/\"");
  
  document.addEventListener('DOMContentLoaded', function () {
    var originHtmlText = JSON.stringify(document.querySelector('.pub__ul').innerHTML);

    
    var pubSearch = document.getElementById('pubSearch');
    var pubList = document.querySelector('.pub__list');
    var pubUl = document.querySelector('.pub__ul');
    var pubResult = document.querySelector('.pub__result');

    var makeLi = function(ulElem, obj) {
      var li = document.createElement('li');
      li.className = 'pub__item';

      var titleLink = document.createElement('a');
      titleLink.innerHTML = obj.title;
      titleLink.setAttribute('href', obj.uri);

      if (obj.booktitle) {
        var span = document.createElement('span');
        span.className = 'p2';
        span.innerText = ' - ' + obj.booktitle;
        titleLink.appendChild(span);
      } else if (obj.shorttitle) {
        var span = document.createElement('span');
        span.className = 'p2';
        span.innerText = ' - ' + obj.shorttitle;
        titleLink.appendChild(span);
      }

      var metaDiv = document.createElement('div');
      metaDiv.setAttribute('class', 'pub__metas');
      if (obj.publishDate) {
        var dateSpan = document.createElement('span');
        dateSpan.className = 'caption pub__meta';
        dateSpan.innerText = '📅 ' + obj.publishDate.slice(0, 10);
        metaDiv.appendChild(dateSpan);
      }

      if (obj.authors) {
        var authorsSpan = document.createElement('span');
        authorsSpan.className = 'caption pub__meta';
        authorsSpan.innerText = '✍️ ' + obj.authors.toString();
        metaDiv.appendChild(authorsSpan);
      }

      if (obj.publication) {
        var pubSpan = document.createElement('span');
        pubSpan.className = 'caption pub__meta';
        pubSpan.innerText = '📚 ' + obj.publication;
        metaDiv.appendChild(pubSpan);
      }

      if (obj.ENTRYTYPE) {
        var typeSpan = document.createElement('span');
        typeSpan.className = 'caption pub__meta';
        typeSpan.innerText = '🎯 ' + obj.ENTRYTYPE;
        metaDiv.appendChild(typeSpan);
      }

      var tagsUl = null;
      if (obj.tags && obj.tags.length) {
        tagsUl = document.createElement('ul');
        tagsUl.setAttribute('class', 'pub__tags caption');
        tagsUl.innerHTML = '&nbsp;🏷️';

        for (var i = 0; i < obj.tags.length; i++) {
          var tagLi = document.createElement('li');
          var tagLink = document.createElement('a');

          tagLink.setAttribute('href', tagsBaseURL + obj.tags[i]);
          tagLink.setAttribute('class', 'pub__tag');
          tagLink.innerText = "#" + obj.tags[i];

          tagLi.appendChild(tagLink);
          tagsUl.appendChild(tagLi);
        }
      }

      var descDiv = document.createElement('div');
      descDiv.className = 'pub__summary';
      if (obj.abstract) {
        descDiv.innerHTML = obj.abstract.substr(0, 300);
      }
      
      li.appendChild(titleLink);
      li.appendChild(metaDiv);
      li.appendChild(descDiv);
      if (tagsUl) {
        metaDiv.appendChild(tagsUl);
      }
      ulElem.appendChild(li);
    }

    var makeHighlightLi = function (ulElem, obj) {
      var li = document.createElement('li');
      li.className = 'pub__item';
      
      var titleLink = document.createElement('a');
      titleLink.innerHTML = obj.item.title;
      titleLink.setAttribute('href', obj.item.uri);

      var descDiv = null;
      if (obj.item.abstract) {
        descDiv = document.createElement('div');
        descDiv.innerHTML = obj.item.abstract;
        descDiv.className = 'pub__summary';
      }
      
      if (obj.matches && obj.matches.length) {
        for (var i = 0; i < obj.matches.length; i++) {
          titleLink.innerHTML = obj.item.title;

          if (obj.matches[i].key === 'title') {
            titleLink.innerHTML = generateHighlightedText(obj.item.title, obj.matches[i].indices);
          }

          if (obj.item.booktitle) {
            var span = document.createElement('span');
            span.className = 'p2';
            span.innerHTML = ' - ' + obj.item.booktitle;
            titleLink.appendChild(span);
          } else if (obj.item.shorttitle) {
            var span = document.createElement('span');
            span.className = 'p2';
            span.innerHTML = ' - ' + obj.item.shorttitle;
            titleLink.appendChild(span);
          }

          var metaDiv = document.createElement('div');
          metaDiv.setAttribute('class', 'pub__metas');

          if (obj.item.publishDate) {
            var dateSpan = document.createElement('span');
            dateSpan.className = 'caption pub__meta';
            dateSpan.innerText = '📅 ' + obj.item.publishDate.slice(0, 10);
            metaDiv.appendChild(dateSpan);
          }

          if (obj.item.authors) {
            var authorsSpan = document.createElement('span');
            authorsSpan.className = 'caption pub__meta';
            authorsSpan.innerText = '✍️ ' + obj.item.authors.toString();
            metaDiv.appendChild(authorsSpan);
          }

          if (obj.item.publication) {
            var pubSpan = document.createElement('span');
            pubSpan.className = 'caption pub__meta';
            pubSpan.innerText = '📚 ' + obj.item.publication;
            metaDiv.appendChild(pubSpan);
          }

          if (obj.item.ENTRYTYPE) {
            var typeSpan = document.createElement('span');
            typeSpan.className = 'caption pub__meta';
            typeSpan.innerText = '🎯 ' + obj.item.ENTRYTYPE;
            metaDiv.appendChild(typeSpan);
          }
          
          var tagsUl = null;
          if (obj.item.tags && obj.item.tags.length) {
            tagsUl = document.createElement('ul');
            tagsUl.setAttribute('class', 'pub__tags caption');
            tagsUl.innerHTML = '&nbsp;🏷️';

            for (var j = 0; j < obj.item.tags.length; j++) {
              var tagLi = document.createElement('li');
              var tagLink = document.createElement('a');

              tagLink.setAttribute('href', tagsBaseURL + obj.item.tags[j]);
              tagLink.setAttribute('class', 'pub__tag');
              tagLink.innerText = "#" + obj.item.tags[j];

              tagLi.appendChild(tagLink);
              tagsUl.appendChild(tagLi);
            }
          }

          if (obj.matches[i].key === 'abstract') {
            descDiv.innerHTML = generateHighlightedText(obj.matches[i].value, obj.matches[i].indices);
          }
        }

        li.appendChild(titleLink);
        if (metaDiv) {
          li.appendChild(metaDiv);
        }
        if (descDiv) {
          li.appendChild(descDiv);
        }
        if (tagsUl && metaDiv) {
          metaDiv.appendChild(tagsUl);
        }
        
        ulElem.appendChild(li);
      }
    }

    function generateHighlightedText(text, regions) {
      if (!regions) {
        return text;
      }

      var content = '', nextUnhighlightedRegionStartingIndex = 0;

      regions.forEach(function (region) {
        if (region[0] === region[1]) {
          return null;
        }

        content += '' +
          text.substring(nextUnhighlightedRegionStartingIndex, region[0]) +
          '<span class="search__highlight">' +
          text.substring(region[0], region[1] + 1) +
          '</span>' +
          '';
        nextUnhighlightedRegionStartingIndex = region[1] + 1;
      });

      content += text.substring(nextUnhighlightedRegionStartingIndex);

      return content;
    };

    pubSearch ?
    pubSearch.addEventListener('input', function(e) {
      var results = fuse.search(e.target.value);
      
      if (enableSearchHighlight) {
        renderSearchHighlightResults(e.target.value, results);
      } else {
        renderSearchResults(e.target.value, results);
      }
    }) : null;

    function renderSearchResults(searchText, results) {
      var originUl = document.querySelector('.pub__ul');
      var newUl = document.createElement('ul');
      newUl.setAttribute('class', 'pub__ul');

      if (!searchText) {
        if (isFirstSection) {
          originUl.innerHTML = JSON.parse(originHtmlText);
          var grid = document.querySelector('.pgrid');
          var msnry = new Masonry(grid, {
            itemSelector: '.pgrid-item',
            columnWidth: '.pgrid-sizer',
            percentPosition: true,
          });
          imagesLoaded(grid).on('progress', function () {
            msnry.layout();
          });
          return null;
        } else {
          fuse ? fuse.list.forEach(function (item) {
            makeLi(newUl, item);
          }) : null;
        }

        pubResult ? pubResult.setAttribute('data-display', 'none') : null;
        originUl ? originUl.setAttribute('data-display', 'block') : null;
      } else if (results) {
        if (results && results.length) {
          results.forEach(function (result) {
            makeLi(newUl, result);
          });

          pubResult ? pubResult.setAttribute('data-display', 'block') : null;
          originUl ? originUl.setAttribute('data-display', 'none') : null;
        }
      }

      originUl.parentNode.replaceChild(newUl, originUl);
    }

    function renderSearchHighlightResults(searchText, results) {
      var originUl = document.querySelector('.pub__ul');
      var newUl = document.createElement('ul');
      newUl.setAttribute('class', 'pub__ul');

      if (!searchText) {
        if (isFirstSection) {
          originUl.innerHTML = JSON.parse(originHtmlText);
          var grid = document.querySelector('.pgrid');
          var msnry = new Masonry(grid, {
            itemSelector: '.pgrid-item',
            columnWidth: '.pgrid-sizer',
            percentPosition: true,
          });
          imagesLoaded(grid).on('progress', function () {
            msnry.layout();
          });
          return null;
        } else {
          fuse ? fuse.list.forEach(function (item) {
            makeLi(newUl, item);
          }) : null;
        }

        pubResult ? pubResult.setAttribute('data-display', 'none') : null;
        originUl ? originUl.setAttribute('data-display', 'block') : null;
      } else if (results) {
        if (results && results.length) {
          results.forEach(function (result) {
            makeHighlightLi(newUl, result);
          });

          pubResult ? pubResult.setAttribute('data-display', 'block') : null;
          originUl ? originUl.setAttribute('data-display', 'none') : null;
        }
      }

      originUl.parentNode.replaceChild(newUl, originUl);
    }

    
    shave('.pub__summary', 150);
  });
</script>
  <div class="hide">
    

<div class="search">
  <span class="icon">
    <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0V0z"/><path d="M15.5 14h-.79l-.28-.27c1.2-1.4 1.82-3.31 1.48-5.34-.47-2.78-2.79-5-5.59-5.34-4.23-.52-7.79 3.04-7.27 7.27.34 2.8 2.56 5.12 5.34 5.59 2.03.34 3.94-.28 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>
  </span>
  <input id="search" aria-label="Site Search" class="input" type="text" placeholder="Search" autocomplete="off">
  <div id="search-results" class="dropdown">
    <div id="search-menu" class="dropdown-menu" role="menu">
    </div>
  </div>
</div>


  </div>
</main>

            
            <footer class="footer">
    
    
<div class="footer__social">
  <div class="social">
    
            
    
            
    
            
    
      
      <a href="mailto:1052642137@qq.com" title="email" aria-label="email">
        <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0V0z"/><path fill="currentColor" d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-.4 4.25l-7.07 4.42c-.32.2-.74.2-1.06 0L4.4 8.25c-.25-.16-.4-.43-.4-.72 0-.67.73-1.07 1.3-.72L12 11l6.7-4.19c.57-.35 1.3.05 1.3.72 0 .29-.15.56-.4.72z"/></svg>
      </a>
            
    
            
    
            
    
      
      <a href="https://github.com/wencaizhang" title="github" aria-label="github">
        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 24 24" version="1.1">
<g id="surface3680">
<path fill="currentColor" d="M 10.898438 2.101562 C 6.300781 2.601562 2.601562 6.300781 2.101562 10.800781 C 1.601562 15.5 4.300781 19.699219 8.398438 21.300781 C 8.699219 21.398438 9 21.199219 9 20.800781 L 9 19.199219 C 9 19.199219 8.601562 19.300781 8.101562 19.300781 C 6.699219 19.300781 6.101562 18.101562 6 17.398438 C 5.898438 17 5.699219 16.699219 5.398438 16.398438 C 5.101562 16.300781 5 16.300781 5 16.199219 C 5 16 5.300781 16 5.398438 16 C 6 16 6.5 16.699219 6.699219 17 C 7.199219 17.800781 7.800781 18 8.101562 18 C 8.5 18 8.800781 17.898438 9 17.800781 C 9.101562 17.101562 9.398438 16.398438 10 16 C 7.699219 15.5 6 14.199219 6 12 C 6 10.898438 6.5 9.800781 7.199219 9 C 7.101562 8.800781 7 8.300781 7 7.601562 C 7 7.199219 7 6.601562 7.300781 6 C 7.300781 6 8.699219 6 10.101562 7.300781 C 10.601562 7.101562 11.300781 7 12 7 C 12.699219 7 13.398438 7.101562 14 7.300781 C 15.300781 6 16.800781 6 16.800781 6 C 17 6.601562 17 7.199219 17 7.601562 C 17 8.398438 16.898438 8.800781 16.800781 9 C 17.5 9.800781 18 10.800781 18 12 C 18 14.199219 16.300781 15.5 14 16 C 14.601562 16.5 15 17.398438 15 18.300781 L 15 20.898438 C 15 21.199219 15.300781 21.5 15.699219 21.398438 C 19.398438 19.898438 22 16.300781 22 12.101562 C 22 6.101562 16.898438 1.398438 10.898438 2.101562 Z M 10.898438 2.101562 "/>
</g>
</svg>

      </a>
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
            
    
    
  


  </div>
</div>

    
<div id="gtt">
  <div class="gtt">
    <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M8.12 14.71L12 10.83l3.88 3.88c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L12.7 8.71c-.39-.39-1.02-.39-1.41 0L6.7 13.3c-.39.39-.39 1.02 0 1.41.39.38 1.03.39 1.42 0z"/></svg>
  </div>
</div>

    <hr />

    <div class="basicflex">
        
            <a href="" class="footer__link" target="_blank" rel="noreferrer"></a>
        
            <a href="" class="footer__link" target="_blank" rel="noreferrer"></a>
        
    </div>

    <div class="footer__poweredby">
        
                
            <p class="caption">
                
                    ©2020, All Rights Reserved
                
            </p>
        

        
            <p class="caption">Powered by <a href="https://gohugo.io/" target="_blank" rel="noreferrer">Hugo</a> and the <a href="https://github.com/zzossig/hugo-theme-zzo" target="_blank" rel="noreferrer">Zzo theme</a></p>
        
        
    </div> 
</footer>
        </div>
        





<div class="wrapper__right hide" data-pad="true" dir="ltr">
  <script>document.querySelector('.wrapper__right').classList.remove('hide')</script>
  
</div>

    </div>
</body>

</html>